import React from "react";

// context传值
// 主要应用场景  不同组件应用同一个值

// 1.先创建
const TheContext = React.createContext('drack')

// 2.包裹
class App extends React.Component{
    render(){
        return(
            // 生产者
            <TheContext.Provider value="1">
                <Toolbar/>
                <Subbmit/>
            </TheContext.Provider>
        )
    }


}

class Subbmit extends React.Component{
    // static contextType = TheContext
    render(){
        return(
        <div>
            <button theme={this.context}>这里有{this.context}颗白菜</button>
        </div>
    )
    }
    
    
}
Subbmit.contextType=TheContext

function Toolbar(props){
    return(
        <div>
                    <Themenutton/>

        </div>
    )
}
// 3.使用 contextType接受 再用this.context传值
class Themenutton extends React.Component{
    static contextType = TheContext
    render(){
        return(
            // 消费者
            <div><button theme={this.context}>这里有{this.context}颗白菜</button></div>
        )
    }
}

export default App

    